<template>
  <div class="account">
    <div class="balance">
      <div class="bala">
        <span>当前余额</span>
        <div class="des">
          <i class="iconfont icon-wenhao"></i>
          <span>余额说明</span>
        </div>
      </div>
      <p>
        <span class="sum">0.00</span>
        <span>元</span>
      </p>
      <button>提现</button>
    </div>
  </div>
</template>

<script>
export default {
  name: 'AccountBalance',
}
</script>

<style lang="less">
body {
  background-color: #f5f5f5;
}
.account {
  background-color: #3190e8;
  padding: 10px 0;
  .balance {
    width: 95%;
    border-radius: 5px;
    margin: 0 auto;
    background-color: white;

    .bala {
      font-size: 14px;
      padding: 5px;
      display: flex;
      justify-content: space-between;

      .des {
        color: #3190e8;
      }
    }

    p {
      padding-left: 5px;
      // box-sizing: border-box;
      span {
        font-size: 16px;
        color: #333;
      }
      .sum {
        font-size: 40px;
      }
    }

    button {
      width: 90%;
      height: 47px;
      font-size: 18px;
      color: #fff;
      background-color: #ccc;
      border: none;
      border-radius: 5px;
      margin: 20px 20px 10px;
    }
  }
}
</style>